import React, { Component } from "react";

const allMessages = [
  { id: 1, title: "message001", content: "我爱你，中国" },
  { id: 3, title: "message003", content: "我爱你，老婆" },
  { id: 5, title: "message005", content: "我爱你，孩子" },
  { id: 6, title: "message006", content: "我爱你，父母" },
];
class MessageDetail extends Component {
  render() {
    const { id } = this.props.match.params;
    const message = allMessages.find((val, index) => val.id === Number(id));
    
    return (
      <ul>
        <li>ID:{message.id}</li>
        <li>TITLE:{message.title}</li>
        <li>CONTENT:{message.content}</li>
      </ul>
    );
  }
}

export default MessageDetail;
